<style scoped>
.clientTransfer {
  margin-right: 0.5vw;
  padding: 0 15px;
  background-color: white;
  height: 95vh;
  position: relative;
}
.clientTransfer_top {
  display: flex;
  padding: 1.5vh 0;
  white-space: nowrap;
}
.clientTransfer_top2 {
  padding-bottom: 1.5vh;
  border-bottom: 2px solid #f4f4f4;
  display: flex;
  white-space: nowrap;
}

.clientTransfer_top2 input:last-child {
  width: 18.7vw;
}
.t_content {
  margin: 0 10px 0 8px;
  padding-top: 3px;
}
.t_content1 {
  padding-top: 3px;
  margin: 0 6px 0 13px;
}
/* .a_color{
    color: #017aff;
  } */
.clientTransfer_c {
  display: flex;
  width: 100%;
  height: 74%;
}

.content1 {
  width: 50%;
  border-right: 1px solid #dbdbdb;
  padding: 2px 10px 0 0;
  height: 76vh;
}
.content2 {
  width: 50%;
  /* height: 100%; */
  padding-left: 10px;
}
.content1_1 {
  display: flex;
  margin: 12px 0;
  overflow: hidden;
}

.content2_1 {
  margin-top: 3px;
}

.footView span {
  float: left;
  margin-right: 48px;
  line-height: 6vh;
  font-size: 14px;
}
.footView span i {
  margin-right: 5px;
}

._content {
  width: 100%;
  height: 32px;
  margin: 1.5vh 0;
  display: flex;
  justify-content: space-between;
}
.clientTransfer input:focus {
  outline: none;
  border: 1px solid #017aff;
}
.inp {
  border: 1px solid #dbdbdb;
  border-radius: 3px;
  height: 30px;
  padding: 0 15px;
}
.inp2 {
  width: 8vw;
}
.inp3 {
  width: 3vw;
  margin-right: 0.5vw;
}
.inp4 {
  width: 8vw;
}
.mask {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  opacity: 0.3;
  z-index: 9;
}
._contentA {
  display: flex;
}
._contentB {
  display: flex;
  width: 150px;
  height: 32px;
  border-radius: 15px;
  background: #f4f4f4;
  padding-left: 10px;
}
._contentB i {
  color: #017aff;
  margin: 9px 6px 0 0;
}
._contentB p {
  margin-top: 4px;
}
._contentB p:last-child {
  color: #017aff;
}
._contentB p:last-child:hover {
  cursor: pointer;
}
.prompt {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 600px;
  height: 200px;
  z-index: 2;
  box-shadow: 3px 3px 3px #f4f4f4;
  background: white;
}
.prompt > div:first-child {
  height: 40px;
  padding: 10px 15px;
  background: #f4f4f4;
  display: flex;
  justify-content: space-between;
}
.prompt > div:first-child > p:first-child {
  font-weight: 700;
}
.prompt > div:last-child {
  padding: 10px 15px;
}
.prompt > div:last-child > div > p {
  margin-top: 10px;
}
.prompt > div:last-child > div:last-child {
  margin-top: 10px;
  float: right;
}
.print {
  width: 230px;
  height: 120px;
  background: white;
  position: absolute;
  top: 20%;
  left: 24%;
  padding: 10px 15px;
  box-shadow: 3px 3px 3px #f4f4f4;
}
.print div:first-child {
  font-weight: 700;
  margin-bottom: 5px;
}
.print div:last-child {
  float: right;
  margin: 10px 0 0 0;
}
.single {
  width: 230px;
  height: 120px;
  background: white;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  box-shadow: 3px 3px 3px #f4f4f4;
}
.single div:first-child {
  background: #f4f4f4;
  padding: 10px 15px;
}
.single div:first-child > p {
  font-weight: 700;
}
.single div:nth-child(2) {
  padding: 10px 15px;
}
.single div:nth-child(2) > div {
  float: right;
  padding: 5px 0 0 0;
}
._num {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 900px;
  z-index: 999;
  background: white;
}
._num > div:first-child {
  display: flex;
  padding: 10px 15px;
  height: 40px;
  background: #f4f4f4;
  justify-content: space-between;
  margin-bottom: 15px;
}
._num > div:nth-child(2) {
  padding: 0 15px;
}
._num > div:last-child > div:last-child {
  float: right;
  margin-bottom: 10px;
}
._num > div:first-child > p:first-child {
  font-weight: 700;
}
._num .enterBarcode {
  background-color: #f4f4f4;
  height: 60px;
  padding: 15px 0 0 10px;
  margin-bottom: 15px;
}
._num .enterBarcode p {
  display: inline;
  margin-right: 10px;
}
</style>

<style>
.clientTransfer .el-input__icon {
  line-height: 30px;
}
.clientTransfer .el-input__inner {
  height: 30px;
}

.clientTransfer ._contentA .el-button {
  padding: 0;
  margin: 0 10px 0 0;
}
.clientTransfer_top2 input {
  width: 8vw;
  height: 30px;
}
.clientTransfer .content1_1 .el-input__inner {
  height: 30px;
}
.clientTransfer .clientTransfer_top .el-select__tags {
  top: 50%;
}
.clientTransfer .clientTransfer_top .el-input__inner {
  width: 8vw;
}
.clientTransfer .block .el-input__inner {
  height: 30px;
}
.clientTransfer .block .el-input__icon {
  line-height: 23px;
}
.clientTransfer .clientTransfer_top .sty .el-input__inner {
  width: 4.5vw;
}
.clientTransfer .el-date-editor .el-range-separator {
  line-height: 25px;
  width: 8%;
}
.clientTransfer .clientTransfer_top .sty2 .el-input__inner {
  width: 8vw;
}
.clientTransfer .clientTransfer_top2 .sty .el-input__inner {
  width: 8vw;
}
.clientTransfer .clientTransfer_top2 .sty1 .el-input__inner {
  width: 100px;
}
.clientTransfer ._content2 .sty3 .el-input__inner {
  width: 70px;
  margin-left: 10px;
}
.clientTransfer ._content2 .sty3 .el-input--suffix .el-input__inner {
  padding: 0 0 0 5px;
}

.clientTransfer .el-date-editor.el-input,
.clientTransfer .el-date-editor.el-input__inner {
  width: 18.6vw;
}
.clientTransfer .build-info-4 .el-input__inner {
  border: 0px;
}
.clientTransfer .build-info-4 .el-input__inner:focus {
  border: 1px solid #017aff;
}

.clieclientTransferntSales .sty2 .el-input__inner {
  width: 8vw;
}
.clientTransfer .sty2 .el-date-editor.el-input,
.clientTransfer .sty2 .el-date-editor.el-input__inner {
  width: 8vw;
}
</style>

<template>
  <div class="clientTransfer">
    <div class="clientTransfer_top">
      <p class="t_content1">客调序号</p>
      <input class="inp inp4" type="text" v-model="Sequence" />
      <p class="t_content">货号</p>
      <input
        @keyup.enter="kindsNumberEnter"
        class="inp inp4"
        type="text"
        v-model="kindsNumber"
      />
      <p class="t_content">调货意向</p>
      <el-select v-model="transferCargoIntention">
        <el-option
          v-for="item in intentionList"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        ></el-option>
      </el-select>
      <p class="t_content" style="margin-left:39px;">调出</p>
      <input
        :disabled="Dis"
        class="inp inp3"
        type="text"
        v-model="outNo"
        @blur="outNoBlur"
      />
      <div class="sty">
        <el-select
          v-model="outName"
          @change="
            (e) => {
              this.outNo = e;
            }
          "
          :disabled="Dis"
        >
          <el-option
            v-for="item in customerList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
            <span style="float:left">{{ item.value }}</span>
            <span style="float:right">{{ item.label }}</span>
          </el-option>
        </el-select>
      </div>
      <p class="t_content">调入</p>
      <input
        class="inp inp3"
        type="text"
        v-model="inputNo"
        @blur="inputNoBlur"
      />
      <div class="sty">
        <el-select
          v-model="inputName"
          @change="
            (e) => {
              this.inputNo = e;
            }
          "
        >
          <el-option
            v-for="item in customerList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
            <span style="float:left">{{ item.value }}</span>
            <span style="float:right">{{ item.label }}</span>
          </el-option>
        </el-select>
      </div>
      <p class="t_content">配货方式</p>
      <div class="sty2">
        <el-select v-model="cooperateWay">
          <el-option
            v-for="item in cooperateWayList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <p class="t_content">操作员</p>
      <el-select v-model="operator">
        <el-option
          v-for="item in operatorList"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        ></el-option>
      </el-select>
    </div>
    <div class="clientTransfer_top2">
      <p class="t_content" style="margin-left:10px">调货日期</p>
      <div class="block">
        <el-date-picker
          unlink-panels
          v-model="dateList"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="yyyy-MM-dd HH:mm:ss"
        ></el-date-picker>
      </div>
      <p class="t_content">限寄日期</p>
      <!-- <input class="inp inp4" type="text" v-model="cw"> -->
      <div class="sty2">
        <el-date-picker
          v-model="inputDate"
          type="date"
          value-format="yyyy-MM-dd HH:mm:ss"
          placeholder="选择日期"
        ></el-date-picker>
      </div>
      <p class="t_content" style="margin-left:13px">VIP地址</p>
      <input class="inp inp2" type="text" v-model="VIPAddress" />
    </div>
    <div class="_content">
      <div class="_contentA">
        <el-button @click="search" icon="el-icon-search" type="primary"
          >查询</el-button
        >
        <el-button @click="Merge" icon="el-icon-money" :disabled="jxAgent"
          >合单</el-button
        >
        <el-button
          @click="beforehand"
          icon="el-icon-folder-checked"
          :disabled="jxAgent"
          >预调保存</el-button
        >
        <!-- <el-button icon="el-icon-download">导入</el-button> -->
        <div class="dr">
          <i class="el-icon-download"></i> 导入
          <input
            ref="upload"
            accept=".xls, .xlsx"
            class="outputlist_upload"
            type="file"
            :disabled="jxAgent"
          />
        </div>
        <el-button @click="printClick" icon="el-icon-printer">列印</el-button>
        <el-button
          @click="createForm"
          style="margin-right:20px"
          icon="el-icon-upload2"
          :disabled="isFinish || jxAgent"
          >生成客进退单</el-button
        >
        <el-button @click="Dele" icon="el-icon-delete">删除</el-button>
        <div class="_contentB">
          <i class="el-icon-question"></i>
          <p>注意：</p>
          <p
            @click="
              () => {
                this.showpop = true;
              }
            "
          >
            温馨提示
          </p>
        </div>
      </div>
      <div class="_content2" style="display:flex">
        <p style="margin-top:2px">状态</p>
        <div class="sty3">
          <el-select v-model="state">
            <el-option
              v-for="item in stateList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </div>
      </div>
    </div>
    <div class="clientTransfer_c">
      <div class="content1">
        <div class="c_tab">
          <el-table
            :data="tableData1"
            style="width: 100%"
            highlight-current-row
            height="76vh"
            :header-cell-style="{
              background: '#f4f4f4',
              padding: 0,
              height: '40px',
            }"
            :cell-style="{ padding: 0, height: '36px' }"
            @selection-change="handleSelectionChange"
            @row-click="rowClick"
          >
            <el-table-column type="selection"></el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="transferCargoSequence"
              label="客户调货序号"
              width="120"
            ></el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="transferCargoT"
              label="调货日期"
              width="100"
            ></el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="calloutCustomer"
              label="调出客户"
              width="120"
            ></el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="number"
              label="数量"
              width="60"
            ></el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="money"
              label="金额"
              width="80"
            ></el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="callout"
              label="调出"
              width="60"
            ></el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="remark"
              label="备注"
              width="200"
            >
              <template slot-scope="scope">
                <el-input
                  size="small"
                  v-model="scope.row['remark']"
                  @keyup.enter.native="
                    remarkEnter($event, {
                      sequence: scope.row['transferCargoSequence'],
                      result: scope.row['remark'],
                      i: scope.$index,
                    })
                  "
                >
                </el-input>
              </template>
            </el-table-column>
            <el-table-column
              prop="print"
              label="列印"
              width="70"
            ></el-table-column>
            <el-table-column
              prop="transportationWay"
              label="运输方式"
            ></el-table-column>
          </el-table>
        </div>
      </div>
      <div class="content2">
        <div class="content2_1">
          <el-table
            :data="tableData2"
            style="width: 100%"
            highlight-current-row
            height="76vh"
            :header-cell-style="{
              background: '#f4f4f4',
              padding: 0,
              height: '40px',
            }"
            :cell-style="{ padding: 0, height: '36px' }"
          >
            <el-table-column
              prop="kindsNumber"
              label="货号"
              width="160"
            ></el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="calloutCustomer"
              label="调出客户"
              width="140"
            ></el-table-column>
            <el-table-column prop="number" label="数量">
              <template slot-scope="scope">
                <el-input
                  size="small"
                  :disabled="scope.row['sequenceStatus'] == '已调'"
                  v-model="scope.row['number']"
                  @keyup.enter.native="
                    numberEnter($event, {
                      sequence: scope.row['transferCargoSequence'],
                      result: scope.row['number'],
                      i: scope.$index,
                    })
                  "
                >
                </el-input>
              </template>
            </el-table-column>
            <el-table-column prop="fold" label="调入">
              <template slot-scope="scope">
                <el-input
                  size="small"
                  :disabled="
                    scope.row['sequenceStatus'] == '已调' ||
                      scope.row.transferCargoIntention == '调回公司'
                  "
                  v-model="scope.row['fold']"
                  @keyup.enter.native="
                    foldEnter($event, {
                      sequence: scope.row['transferCargoSequence'],
                      result: scope.row['fold'],
                      i: scope.$index,
                    })
                  "
                >
                </el-input>
              </template>
            </el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="foldName"
              label="调入客户"
            ></el-table-column>
            <el-table-column
              show-overflow-tooltip
              prop="transferCargoT"
              label="调货日期1"
              width="100"
            ></el-table-column>
            <el-table-column prop="callout" label="调出"></el-table-column>
            <el-table-column
              prop="sequenceStatus"
              label="状态"
            ></el-table-column>
            <el-table-column
              prop="transferCargoIntention"
              label="调货意向"
            ></el-table-column>
            <el-table-column
              prop="operator"
              label="操作员"
              width="100"
            ></el-table-column>
          </el-table>
        </div>
      </div>
    </div>

    <!-- 生成客进退框 -->
    <!-- <div class="single" v-if="Single">
      <div>
        <p>列印方式</p>
      </div>
      <div>
        <p>确定要打印进退单吗？</p>
        <div>
          <el-button @click="()=>{this.Single=false}">取消</el-button>
          <el-button type="primary">确定</el-button>
        </div>
      </div>
    </div> -->

    <!-- 列印框 -->
    <div class="print" v-show="Print">
      <div>列印方式</div>
      <el-radio v-model="radio" label="1">有小图</el-radio>
      <el-radio v-model="radio" label="2">无图</el-radio>
      <div>
        <el-button
          @click="
            () => {
              this.Print = false;
            }
          "
          >取消</el-button
        >
        <el-button @click="openPrint(1)" type="primary">确定</el-button>
      </div>
    </div>

    <!-- 提示框 -->
    <div class="prompt" v-if="showpop">
      <div>
        <p>温馨提示</p>
        <i @click="closepop" class="el-icon-close"></i>
      </div>
      <div>
        <div>
          <p>
            温馨提示：如果是客户之间的调货，请在此生成客户进退单！不要在客户进货窗口去录入，这样避开店铺下载此客进，而产生，店铺数据重复！
          </p>
          <p>
            因为客户之间调货单据，是店铺先到货，输入店铺厂进，然后通知公司。
          </p>
        </div>
        <div>
          <el-button @click="closepop">取消</el-button>
          <el-button @click="closepop" type="primary">确定</el-button>
        </div>
      </div>
    </div>

    <div class="mask" v-show="shownum"></div>
    <!-- 输入数量 -->
    <div class="_num" v-show="shownum">
      <div>
        <p>输入数量</p>
        <i @click="closenum" class="el-icon-close"></i>
      </div>

      <div>
        <div class="enterBarcode">
          <p>货号</p>
          <el-input
            ref="kindsNumberInp"
            style="width:175px"
            @keyup.enter.native="kindsNumberEnter"
            v-model="kindsNumber"
            placeholder="输入货号，输完按回车"
          >
          </el-input>
        </div>
        <div class="build-info-4">
          <el-table
            id="codeTable"
            border
            :data="codeData"
            class="tb-edit"
            style="width: 100%;margin-bottom:15px"
            max-height="148px"
            @cell-click="cellClick"
            :header-cell-style="{
              background: '#f4f4f4',
              padding: 0,
              height: '40px',
            }"
            :cell-style="{ padding: 0, height: '36px' }"
          >
            <el-table-column :label="header" width="150"> </el-table-column>
            <el-table-column prop="colorName" label="颜色" width="100">
            </el-table-column>

            <template v-for="i in sizeList">
              <el-table-column :prop="i" :label="i" :key="i + Math.random()">
                <template slot-scope="scope">
                  <el-input
                    size="small"
                    class="innerInp"
                    v-model="scope.row[i]"
                    @blur="
                      handleInputBlurResult($event, {
                        index: scope.$index,
                        key: i,
                        result: scope.row[i],
                      })
                    "
                    @keyup.enter.native="inpEnter"
                  >
                  </el-input>
                  <!-- <span>{{scope.row[i]}}</span> -->
                </template>
              </el-table-column>
            </template>
          </el-table>
        </div>
        <div>
          <el-button @click="closenum">取消</el-button>
          <el-button @click="closenum" type="primary" plain>确定</el-button>
          <el-button @click="continueInput" type="primary">继续录入</el-button>
        </div>
      </div>
    </div>

    <!-- 底部框 -->
    <!-- <foot-view class="footView">
      <div slot="text">
        <span>数据库：{{jxQuarter}}</span>
      </div>
    </foot-view> -->

    <!-- 改单密码验证 -->
    <verify-password
      v-if="showpwd"
      :operationType="operationType"
      :isConfirm="isConfirm"
      @closepwd="
        () => {
          this.showpwd = false;
        }
      "
      @showRevision="showRevision"
    ></verify-password>

    <div v-show="false" id="p"></div>
  </div>
</template>

<script>
const resources = require("../../../config/printCSS2");

import {
  getCustomerTransfer,
  getOperatorList,
  insert,
  merge,
  addCustomerInputOutSingle,
  update,
  print,
} from "../../../network/customerTransfer";
import { getClient } from "../../../network/client";
import { getKindsNumberList } from "../../../network/artNo";
import { getBarCode } from "../../../network/manufacturer";
import { userList } from "../../../network/login";
import verifyPassword from "../../../components/VerifyPassword";
import footView from "../../../components/FootView";
import { getShop } from "../../../network/shop";
import today from "../../../components/mixins/today";
import enterUp from "../../../components/mixins/enterUp";
import cookieFn from "../../../components/mixins/cookieFn";

import XLSX from "xlsx";
import FileSaver from "file-saver";

export default {
  name: "client_transfer",
  mixins: [today, enterUp, cookieFn],
  data() {
    return {
      Dis: false,
      isConfirm: false,
      operationType: 0,
      showpwd: false,
      showCReviSion: false,
      inpList: [],
      sessionId: "",

      shownum: false,
      Single: false,
      Print: false,
      showpop: false,

      manufacturerBarCode: {},
      originalData: {},

      sequence: "",
      Sequence: "",
      kindsNumber: "",
      transferCargoIntention: "直接调转",
      intentionList: [
        { lable: "直接调转", value: "直接调转" },
        { lable: "调回公司", value: "调回公司" },
      ],
      outNo: "",
      outName: "",
      inputNo: "",
      inputName: "",
      customerList: [],
      customerMap: {},
      cooperateWay: "配货",
      cooperateWayList: [
        { value: "配货", label: "配货" },
        { value: "订货", label: "订货" },
        { value: "订断", label: "订断" },
        { value: "追断", label: "追断" },
      ],
      operatorList: [],
      dateList: null,
      inputDate: this.searchDateWithHour(-3),
      VIPAddress: "",
      state: "预调",
      stateList: [
        { value: "预调", label: "预调" },
        { value: "已调", label: "已调" },
        { value: "所有", label: "所有" },
      ],
      radio: "1",
      tableData1: [],
      tableData2: [],

      infoList: [],

      mergeData: [],

      header: "",
      sizeList: ["7", "9", "1", "3", "5", "7", "F"],
      codeData: [],

      operator: this.getCookie("jxUser"),
      jxQuarter: this.getCookie("jxQuarter"),
      jxAgent: this.getCookie("jxAgent") == 1,

      isFinish: false,

      hasImage: true,
      printType: "",
      printOperator: "",
      printRemark: "",
      printInput: "",
      printInputNo: "",
      printOutput: "",
      printOutputNo: "",
      printdate: "",
      printToday: this.searchDate(),
      printTime: "",
      printAddress: "",
      printPhone: "",
      printCellPhone: "",
    };
  },
  watch: {
    printInputNo(a, b) {
      getClient({ no: a }).then((res) => {
        this.printInput = res.data.data[0].name;
        this.printPhone = res.data.data[0].phone;
        this.printCellPhone = res.data.data[0].cellphone;
        this.printAddress = res.data.data[0].address;
      });
    },
    sequence(a, b) {
      this.sequence = a.toUpperCase().trim();
    },
    kindsNumber(a, b) {
      this.kindsNumber = a.toUpperCase().trim();
    },
    outNo(a, b) {
      this.outNo = a.toUpperCase().trim();
    },
    inputNo(a, b) {
      this.inputNo = a.toUpperCase().trim();
    },
  },
  components: {
    footView,
    verifyPassword,
  },
  methods: {
    showRevision() {
      switch (this.operationType) {
        case 3:
          this.$router.push({
            path: "/delete_document",
            query: { type: 11, sequence: this.sequence },
          });
          this.$store.commit("addNav", {
            label: "客户调货删单",
            name: "delete_document",
          });
          break;
      }
    },
    //删除
    Dele() {
      if (!this.sequence) return;
      this.operationType = 3;
      this.showpwd = true;
    },
    sibling(e) {
      let s = [];
      let pp = e.parentNode.parentNode.children;
      for (let j = 0; j < pp.length; j++) {
        let p = pp[j].children;
        for (let i = 0, pl = p.length; i < pl; i++) {
          if (p[i] !== e) s.push(p[i]);
        }
      }
      return s;
    },
    handleInputBlurResult(e, { index, key, result }) {
      e.target.parentNode.parentNode.parentNode.classList.remove("activeCell");
      // let r = /^\+?[1-9][0-9]*$/
      let r = /^(0|[1-9][0-9]*|-[1-9][0-9]*)$/;
      if (result != 0) {
        result = result.replace(/\b(0+)/gi, "");
      }
      if (!r.test(result) && result) {
        this.$alert("数量请输入整数", "", {
          confirmButtonText: "确定",
        });
        this.codeData[index][key] = 0;
        return;
      }
      this.codeData[index][key] = result;
    },
    cellClick(row, column, cell, event) {
      // console.log(row)  //当行的全部数据
      // console.log(column)  //当列的全部数据
      // console.log(cell)  //点击格的html代码  td>div
      // console.log(event)  //MouseEvent
      // console.log(cell.innerHTML)

      // console.log(cell.children[0].children[0].children)
      // cell.children[0].children[0].children[0].focus()
      cell.classList.add("activeCell");
      let s = this.sibling(cell);
      // console.log(s)
      s.forEach((e) => {
        e.classList.remove("activeCell");
      });
    },
    inpEnter(e) {
      e.target.parentNode.parentNode.parentNode.classList.remove("activeCell");
    },

    closepop() {
      this.showpop = false;
    },
    closenum() {
      this.shownum = false;
      this.codeData = [];
      this.kindsNumber = "";
    },

    kindsNumberEnter() {
      if (this.jxAgent) return;
      if (this.kindsNumber) {
        if (!this.outNo) {
          this.$message.error("调出客户不能为空");
          return;
        }
        if (this.inputNo == this.outNo) {
          this.$message.error("调入和调出客户不能相同");
          return;
        }
        if (!this.outNo) {
          this.transferCargoIntention = "直接调转";
        }
        if (!this.shownum) this.shownum = true;

        getKindsNumberList({ kindsNumberStr: this.kindsNumber }).then((res) => {
          // console.log(res)
          if (res.data.data.data == "") {
            this.$message.warning("未查询查到此款号信息");
            return;
          }
          if (res.data.code == 200) {
            this.header = res.data.data.data[0].styleNumber;
            // 品牌公司查条码规律详情
            getBarCode({ company: res.data.data.data[0].brandedCompany }).then(
              (res) => {
                this.manufacturerBarCode = res.data.data[0];
              }
            );
            // console.log(this.manufacturerBarCode)
            // 输入款号显示中间表和尺码信息   ZZZ-AAS
            res.data.data.data.sort((a, b) => {
              return a.relevanceSize.localeCompare(b.relevanceSize);
            });
            let tmp = res.data.data.data;

            // 中间表  尺码表头
            this.sizeList = [tmp[0].size];
            let isExistSize = 0;
            for (const i of tmp) {
              for (const j of this.sizeList) {
                if (j == i.size) {
                  isExistSize = 0;
                  break;
                }
                isExistSize = 1;
              }
              if (isExistSize) {
                this.sizeList.push(i.size);
              }
            }

            // 中间表
            let tmpCodeData = [
              { colorNo: tmp[0].colorNo, colorName: tmp[0].colorName },
            ];
            let isExistColor = 0;
            for (const i of tmp) {
              for (const j of tmpCodeData) {
                if (j.colorName == i.colorName) {
                  isExistColor = 0;
                  break;
                }
                isExistColor = 1;
              }
              if (isExistColor) {
                tmpCodeData.push({
                  colorNo: i.colorNo,
                  colorName: i.colorName,
                });
              }
            }
            tmpCodeData.forEach((e) => {
              this.sizeList.forEach((f) => {
                e[f] = "";
              });
            });
            this.codeData = tmpCodeData;
            this.inpList = this.getInput();
            let codeTable = document.getElementById("codeTable");
            let inputs = codeTable.getElementsByTagName("input");
            // console.log(inputs)
            let int = setInterval(() => {
              clearInterval(int);
              inputs[0].focus();
              inputs[inputs.length - 1].onkeyup = (e) => {
                if (window.event.keyCode == 13) {
                  this.continueInput();
                  inputs[inputs.length - 1].onkeyup = () => {};
                }
              };
            }, 100);
          }
        });
      }
    },
    // 查询
    search() {
      this.isFinish = false;
      this.tableData1 = [];
      this.tableData2 = [];
      let params = {
        transferCargoSequence: this.Sequence,
        kindsNumber: this.kindsNumber,
        transferCargoIntention: this.transferCargoIntention,
        outNo: this.outNo,
        inputNo: this.inputNo,
        cooperateWay: this.cooperateWay,
        operator: this.operator,
        startTime: this.dateList ? this.dateList[0] : "",
        endTime: this.dateList
          ? this.dateList[1].slice(0, 10) + " 23:59:59"
          : "",
        VIPAddress: this.VIPAddress,
        sequenceStatus: this.state == "所有" ? "" : this.state,
      };
      // console.log(params)
      getCustomerTransfer(params).then((res) => {
        if (res.data.code == 200) {
          this.tableData1 = res.data.data.customerTransferCargoTotalList;
          this.infoList = res.data.data.customerTransferCargoInfoList;
          this.tableData1.forEach((e) => {
            e.transferCargoT = e.transferCargoTime.slice(0, 10);
            e.iRemark = e.remark;
            e.print = e.linePrinting == 1 ? "已列印" : "未列印";
          });
          this.infoList.forEach((e) => {
            e.transferCargoT = e.transferCargoTime.slice(0, 10);
            e.iNumber = e.number;
            e.iFold = e.fold;
            e.iFoldName = e.foldName;
          });
          this.tableData2 = this.infoList;
        }
      });
    },
    // 合单
    Merge() {
      if (!this.mergeData.length) {
        this.$alert("请先勾选单号再进行合单", "", {
          confirmButtonText: "确定",
        });
        return;
      }
      if (this.mergeData.length == 1) {
        this.$alert("当前只选择了一条数据", "", {
          confirmButtonText: "确定",
        });
        return;
      }

      for (let i = 0, len = this.mergeData.length; i < len; i++) {
        if (this.mergeData[i + 1]) {
          // console.log(this.mergeData[i+1])
          if (this.mergeData[i].fold != this.mergeData[i + 1].fold) {
            this.$alert(
              `${this.mergeData[i].transferCargoSequence}与${
                this.mergeData[i + 1].transferCargoSequence
              }调入客户不一致`,
              "",
              {
                confirmButtonText: "确定",
              }
            );
            return;
          }
          if (this.mergeData[i].callout != this.mergeData[i + 1].callout) {
            this.$alert(
              `${this.mergeData[i].transferCargoSequence}与${
                this.mergeData[i + 1].transferCargoSequence
              }调出客户不一致`,
              "",
              {
                confirmButtonText: "确定",
              }
            );
            return;
          }
          if (
            this.mergeData[i].transferCargoT !=
            this.mergeData[i + 1].transferCargoT
          ) {
            this.$alert(
              `${this.mergeData[i].transferCargoSequence}与${
                this.mergeData[i + 1].transferCargoSequence
              }调货时间不一致`,
              "",
              {
                confirmButtonText: "确定",
              }
            );
            return;
          }
        }
      }

      // console.log(this.mergeData)
      merge(JSON.stringify(this.mergeData)).then((res) => {
        if (res.data.code == 200) {
          this.$message({
            message: "合单成功",
            type: "success",
          });
          this.search();
        } else {
          this.$message.error("合单失败");
        }
      });
    },
    // 预调保存
    beforehand() {
      if (!this.outNo) {
        this.$message.error("调出客户不能为空");
        return;
      }
      if (this.inputNo == this.outNo) {
        this.$message.error("调入和调出客户不能相同");
        return;
      }
      if (!this.outNo) {
        this.transferCargoIntention = "直接调转";
      }
      this.shownum = true;
      this.sequence = "";
      this.Sequence = "";
    },
    // 继续录入
    continueInput() {
      // 是否有信息变动
      let isNew = false;
      if (JSON.stringify(this.originalData) == "{}") {
        // 第一次点读卡，记录原始数据
        this.originalData.transferCargoIntention = this.transferCargoIntention;
        this.originalData.outNo = this.outNo;
        this.originalData.inputNo = this.inputNo;
        this.originalData.cooperateWay = this.cooperateWay;
        this.originalData.operator = this.operator;
        this.originalData.startTime = this.dateList[0];
        this.originalData.endTime = this.dateList[1];
        this.originalData.VIPAddress = this.VIPAddress;
      } else {
        // 判断是否修改了数据
        for (const key in this.originalData) {
          if (this.originalData.hasOwnProperty(key)) {
            const e = this.originalData[key];
            if (key == "startTime") {
              if (e.slice(0, 10) != this.dateList[0].slice(0, 10)) {
                isNew = true;
                break;
              }
            } else if (key == "endTime") {
              if (e.slice(0, 10) != this.dateList[1].slice(0, 10)) {
                isNew = true;
                break;
              }
            } else {
              if (e != this[key]) {
                isNew = true;
                break;
              }
            }
          }
        }
        if (isNew) {
          // 修改了数据 重新赋值
          this.originalData.transferCargoIntention = this.transferCargoIntention;
          this.originalData.outNo = this.outNo;
          this.originalData.inputNo = this.inputNo;
          this.originalData.cooperateWay = this.cooperateWay;
          this.originalData.operator = this.operator;
          this.originalData.startTime = this.dateList[0];
          this.originalData.endTime = this.dateList[1];
          this.originalData.VIPAddress = this.VIPAddress;

          this.sequence = "";
        }
      }

      let knList = [];
      this.codeData.forEach((e) => {
        let c = e.colorNo;
        this.sizeList.forEach((f) => {
          if (this.manufacturerBarCode.styleColorSize) {
            // 型尺色

            if (this.manufacturerBarCode.styleColor) {
              // 款号与尺码之间有 -

              if (this.manufacturerBarCode.colorSize) {
                // 色号与尺码之间有 -
                knList.push({
                  kindsNumber: `${this.header}-${f}-${c}`,
                  number: e[f],
                });
              } else {
                // 色号与尺码之间没有 -
                knList.push({
                  kindsNumber: `${this.header}-${f}${c}`,
                  number: e[f],
                });
              }
            } else {
              // 款号与尺码之间没有 -

              if (this.manufacturerBarCode.colorSize) {
                // 色号与尺码之间有 -
                knList.push({
                  kindsNumber: `${this.header}${f}-${c}`,
                  number: e[f],
                });
              } else {
                // 色号与尺码之间没有 -
                knList.push({
                  kindsNumber: `${this.header}${f}${c}`,
                  number: e[f],
                });
              }
            }
          } else {
            // 型色尺

            if (this.manufacturerBarCode.styleColor) {
              // 款号与颜色之间有 -

              if (this.manufacturerBarCode.colorSize) {
                // 色号与尺码之间有 -
                knList.push({
                  kindsNumber: `${this.header}-${c}-${f}`,
                  number: e[f],
                });
              } else {
                // 色号与尺码之间没有 -
                knList.push({
                  kindsNumber: `${this.header}-${c}${f}`,
                  number: e[f],
                });
              }
            } else {
              // 款号与颜色之间没有 -

              if (this.manufacturerBarCode.colorSize) {
                // 色号与尺码之间有 -
                knList.push({
                  kindsNumber: `${this.header}${c}-${f}`,
                  number: e[f],
                });
              } else {
                // 色号与尺码之间没有 -
                knList.push({
                  kindsNumber: `${this.header}${c}${f}`,
                  number: e[f],
                });
              }
            }
          }
        });
      });

      let list = [];
      for (const i of knList) {
        if (i.number == "" || i.number == 0) continue;
        let calloutName = this.customerMap[this.outNo];
        let foldName = this.customerMap[this.foldName];
        list.push({
          sessionId: this.sessionId,
          transferCargoSequence: this.sequence,
          kindsNumber: i.kindsNumber,
          number: i.number,
          transferCargoIntention: this.transferCargoIntention,
          callout: this.outNo,
          calloutName,
          fold: this.inputNo,
          foldName,
          cooperateWay: this.cooperateWay,
          operator: this.operator,
          vipAddress: this.VIPAddress,
        });
      }

      // console.log(list)
      if (!list.length) {
        this.$alert("无数据无法继续录入", "", {
          confirmButtonText: "确定",
        });
        return;
      }
      insert(JSON.stringify(list)).then((res) => {
        if (res.data.code == 200) {
          this.header = "";
          this.codeData = [];
          if (!this.sequence) this.sequence = res.data.data;
          this.$message({
            message: "录入成功",
            type: "success",
          });
          this.kindsNumber = "";
          this.$refs.kindsNumberInp.focus();
        }
        // else {
        //   this.$message.error('录入失败')
        // }
      });
    },
    // 生成客进退单
    createForm() {
      if (!this.sequence) {
        this.$alert("生成客进退单 请点选左表一条数据，而非勾选", "", {
          confirmButtonText: "确定",
        });
        return;
      }
      // console.log(this.tableData2)
      addCustomerInputOutSingle(JSON.stringify(this.tableData2)).then((res) => {
        if (res.data.code == 200) {
          this.Single = true;
          this.$message({
            message: "生成客进退单成功",
            type: "success",
          });
          this.sequence = "";
          this.search();
        } else {
          this.$message.error("生成客进退单失败");
        }
      });
    },
    //表格导入
    readExcel(e) {
      if (this.jxAgent) return;
      if (!this.outNo) {
        this.$message.error("调出客户不能为空");
        this.$refs.upload.value = "";
        return;
      }
      if (this.inputNo == this.outNo) {
        this.$message.error("调入和调出客户不能相同");
        this.$refs.upload.value = "";
        return;
      }
      if (!this.outNo) {
        this.transferCargoIntention = "直接调转";
      }

      let that = this;

      const files = e.target.files;
      // console.log(files)
      if (files.length <= 0) {
        //如果没有文件名
        return false;
      } else if (!/\.(xls|xlsx)$/.test(files[0].name.toLowerCase())) {
        this.$Message.error("上传格式不正确，请上传xls或者xlsx格式");
        return false;
      }

      const fileReader = new FileReader();
      fileReader.onload = (ev) => {
        try {
          const data = ev.target.result;
          const workbook = XLSX.read(data, {
            type: "binary",
          });
          const wsname = workbook.SheetNames[0]; //取第一张表
          const ws = XLSX.utils.sheet_to_json(workbook.Sheets[wsname]); //生成json表格内容
          // console.log(ws)
          // 是否有信息变动
          let isNew = false;

          if (JSON.stringify(this.originalData) == "{}") {
            // 第一次点读卡，记录原始数据
            this.originalData.transferCargoIntention = this.transferCargoIntention;
            this.originalData.outNo = this.outNo;
            this.originalData.inputNo = this.inputNo;
            this.originalData.cooperateWay = this.cooperateWay;
            this.originalData.operator = this.operator;
            this.originalData.startTime = this.dateList[0];
            this.originalData.endTime = this.dateList[1];
            this.originalData.VIPAddress = this.VIPAddress;
          } else {
            // 判断是否修改了数据
            for (const key in this.originalData) {
              if (this.originalData.hasOwnProperty(key)) {
                const e = this.originalData[key];
                if (key == "startTime") {
                  if (e != this.dateList[0]) {
                    isNew = true;
                    break;
                  }
                } else if (key == "endTime") {
                  if (e != this.dateList[1]) {
                    isNew = true;
                    break;
                  }
                } else {
                  if (e != this[key]) {
                    isNew = true;
                    break;
                  }
                }
              }
            }
            if (isNew) {
              // 修改了数据 重新赋值
              this.originalData.transferCargoIntention = this.transferCargoIntention;
              this.originalData.outNo = this.outNo;
              this.originalData.inputNo = this.inputNo;
              this.originalData.cooperateWay = this.cooperateWay;
              this.originalData.operator = this.operator;
              this.originalData.startTime = this.dateList[0];
              this.originalData.endTime = this.dateList[1];
              this.originalData.VIPAddress = this.VIPAddress;

              this.sequence = "";
            }
          }

          let list = [];
          for (const i of ws) {
            // console.log(i)
            let calloutName = this.customerMap[this.outNo];
            let foldName = this.customerMap[this.foldName];
            i.货号 = i.货号
              .toString()
              .toUpperCase()
              .trim();
            if (Number(i.数量) && i.货号) {
              list.push({
                sessionId: this.sessionId,
                transferCargoSequence: this.sequence,
                kindsNumber: i.货号,
                number: i.数量,
                transferCargoIntention: this.transferCargoIntention,
                callout: this.outNo,
                calloutName,
                fold: this.inputNo,
                foldName,
                cooperateWay: this.cooperateWay,
                operator: this.operator,
                vipAddress: this.VIPAddress,
              });
            }
          }
          console.log(list);
          insert(JSON.stringify(list)).then((res) => {
            console.log(res);
            if (res.data.code == 200) {
              if (!this.sequence) this.sequence = res.data.data;
              this.$message({
                message: `导入成功，客调序号为${res.data.data}`,
                type: "success",
              });
            } else {
              this.$message.error("导入失败");
            }
          });
          this.$refs.upload.value = "";
        } catch (e) {
          // console.log(e)
          return false;
        }
      };
      fileReader.readAsBinaryString(files[0]);
    },

    handleSelectionChange(e) {
      this.mergeData = e;
    },
    rowClick(row) {
      // console.log(row)
      this.sequence = row.transferCargoSequence;
      this.printType = row.transportationWay;
      this.printRemark = row.remark || "";
      this.printInputNo = row.fold;
      this.printOutput = row.calloutCustomer;
      this.printOutputNo = row.callout;
      this.printdate = row.transferCargoT;
      this.printTime = row.transferCargoTime.slice(0, 10);

      if (row.totalOutSequence || row.totalSellSequence) {
        this.isFinish = true;
      } else {
        this.isFinish = false;
      }

      this.tableData2 = [];
      this.infoList.forEach((e) => {
        if (e.transferCargoSequence == this.sequence) {
          this.tableData2.push(e);
          if (!this.tableData2.length && e.sequenceStatus == "已调") {
            // this.isFinish = true
            this.printOperator = e.operator;
          } else {
            // this.isFinish = false
            this.printOperator = e.operator;
          }
        }
      });
      this.printInput = this.tableData2[0].foldName;
    },
    outNoBlur() {
      this.outName = this.customerMap[this.outNo] || "";
      if (!this.outName) {
        this.$message.error("无此客户编号");
        this.outNo = "";
      }
    },
    inputNoBlur() {
      this.inputName = this.customerMap[this.inputNo] || "";
      if (!this.inputName) {
        this.$message.error("无此客户编号");
        this.inputNo = "";
      }
    },

    printClick() {
      if (!this.sequence) {
        this.$alert("请先选择一条数据", "", {
          confirmButtonText: "确定",
        });
        return;
      }
      this.clearPrintArea();
      this.Print = true;
    },
    openPrint(n) {
      // console.log('openPrint', n)
      this.Print = false;
      if (this.radio == "1") {
        this.hasImage = false;
      } else {
        this.hasImage = true;
      }
      // console.log(this.hasImage)

      let index = --n;
      let printBody = document.getElementById("p");
      let length = this.tableData2.length;

      if (!this.tableData2[0].linePrinting) {
        this.tableData2.forEach((e) => {
          e.linePrinting = 1;
        });
        print({ transferCargoSequence: this.sequence });
      }

      if (!index) {
        let printHead = document.createElement("div");
        if (!this.hasImage) {
          printHead.innerHTML = `
            <p style="margin:5mm auto 0;font-weight: bold;font-size: 18px;">
              客户调货明细表
            </p>
            <div class="info">
              <p>运输方式：</p>
              <p>调货序号：${this.sequence}</p>
            </div>
            <div class="printHeader">
              <div class="info">
                <p>调入：${this.printInputNo}.${this.printInput}</p>
                <p>（调出：${this.printOutput}）</p>
                <p>调货日期：${this.printdate}</p>
              </div>
              <div class="info">
                <p>请将下表的货品于：${this.printTime}前寄往下面地址</p>
              </div>
              <div class="info">
                <p>请寄往此地址：${this.printAddress}</p>
              </div>
              <div class="info">
                <p>联系人（收件人）：${this.printInput}</p>
                <p>电话：${this.printPhone}</p>
                <p>手机：${this.printCellPhone}</p>
              </div>
              <div class="info">
                <p>并将货运单传回公司，谢谢合作！祝生意兴隆！</p>
              </div>
              <div class="info">
                <p>打印日期：${this.printToday}</p>
              </div>
            </div>
          `;
        } else {
          printHead.innerHTML = `
            <p style="margin:5mm auto 0;font-weight: bold;font-size: 18px;">
              调货通知单
            </p>
            <div class="info">
              <p>运输方式：</p>
              <p>调货序号：${this.sequence}</p>
            </div>
            <div class="printHeader">
              <div class="info">
                <p>调入：${this.printInputNo}.${this.printInput}</p>
                <p>（调出：${this.printOutput}）</p>
                <p>调货日期：${this.printdate}</p>
              </div>
              <div class="info">
                <p>请将下表的货品于：${this.printTime}前寄往下面地址</p>
              </div>
              <div class="info">
                <p>请寄往此地址：${this.printAddress}</p>
              </div>
              <div class="info">
                <p>联系人（收件人）：${this.printInput}</p>
                <p>电话：${this.printPhone}</p>
                <p>手机：${this.printCellPhone}</p>
              </div>
              <div class="info">
                <p>并将货运单传回公司，谢谢合作！祝生意兴隆！</p>
              </div>
              <div class="info">
                <p>打印日期：${this.printToday}</p>
              </div>
            </div>
          `;
        }
        printBody.appendChild(printHead);
      }

      let itemBox = document.createElement("div");
      itemBox.classList.add("printBody");

      for (index; index < length; index++) {
        const e = this.tableData2[index];
        let itemTable = document.createElement("table");
        itemTable.border = "1";
        itemTable.align = "center";
        itemTable.classList.add("printItem");
        itemTable.style.marginTop = "5px";
        if (!this.hasImage) {
          itemTable.innerHTML = `
            <tr>
              <td>No.</td>
              <td>${e.kindsNumber} ${e.colorName}</td>
            </tr>
            <tr>
              <td>数量</td>
              <td>${e.number}</td>
            </tr>
            <tr>
              <td>售价</td>
              <td>${e.sellingPrice}</td>
            </tr>
            <tr>
              <td>品牌</td>
              <td>${e.brandedName}</td>
            </tr>
            <tr>
              <td>${e.commodityName}</td>
              <td style='overflow:hidden;'>
                <img src="${e.image}">
              </td>
            </tr>
          `;
          itemBox.appendChild(itemTable);
          if (
            parseInt((index + 1) / 6) &&
            (index + 1) % 6 == 0 &&
            index + 1 != length
          ) {
            // 到6了
            printBody.appendChild(itemBox);

            let printFoot = document.createElement("div");
            printFoot.classList.add("printFoot");
            printFoot.innerHTML = `
              <div class="info">
                <p>本页合计：6</p>
              </div>
              <div class="info">
                <p>请务必配合调货，并附带明细，快递单号传回本公司。</p>
              </div>
              <div class="info">
                <p>若已销售请通知本公司业务，谢谢！</p>
                <p>制单员：${this.printOperator}</p>
              </div>
              <div class="info">
                <p>备注：${this.printRemark}</p>
              </div>
            `;
            printBody.appendChild(itemBox);
            printBody.appendChild(printFoot);
            let printHead = document.createElement("div");
            printHead.innerHTML = `
              <p style="margin:5mm auto 0;font-weight: bold;font-size: 18px;">
                客户调货明细表
              </p>
              <div class="printHeader">
                <div class="info">
                  <p>调入：${this.printInputNo}.${this.printInput}</p>
                  <p>（调出：${this.printOutput}）</p>
                  <p>调货日期：${this.printdate}</p>
                </div>
                <div class="info">
                  <p>请将下表的货品于：${this.printTime}前寄往下面地址</p>
                </div>
                <div class="info">
                  <p>请寄往此地址：${this.printAddress}</p>
                </div>
                <div class="info">
                  <p>联系人（收件人）：${this.printInput}</p>
                  <p>电话：${this.printPhone}</p>
                  <p>手机：${this.printCellPhone}</p>
                </div>
                <div class="info">
                  <p>并将货运单传回公司，谢谢合作！祝生意兴隆！</p>
                </div>
                <div class="info">
                  <p>打印日期：${this.printToday}</p>
                </div>
              </div>
            `;

            printHead.style.pageBreakBefore = "always";
            printBody.appendChild(printHead);
            this.openPrint(index + 2);
            return;
          }
        } else {
          itemTable.innerHTML = `
            <tr>
              <td>No.</td>
              <td colspan="2">${e.kindsNumber} ${e.colorName}</td>
            </tr>
            <tr>
              <td>数量</td>
              <td style='width:10mm'>${e.number}</td>
              <td>统一零售价：${e.sellingPrice}</td>
            </tr>
          `;
          itemBox.appendChild(itemTable);
          if (
            parseInt((index + 1) / 24) &&
            (index + 1) % 24 == 0 &&
            index + 1 != length
          ) {
            // 到24了
            printBody.appendChild(itemBox);

            let printFoot = document.createElement("div");
            printFoot.classList.add("printFoot");
            printFoot.innerHTML = `
              <div class="info">
                <p>本页合计：24</p>
              </div>
              <div class="info">
                <p>请务必配合调货，并附带明细，快递单号传回本公司。</p>
              </div>
              <div class="info">
                <p>若已销售请通知本公司业务，谢谢！</p>
                <p>制单员：${this.printOperator}</p>
              </div>
              <div class="info">
                <p>备注：${this.printRemark}</p>
              </div>
            `;
            printBody.appendChild(itemBox);
            printBody.appendChild(printFoot);
            let printHead = document.createElement("div");
            printHead.innerHTML = `
              <p style="margin:5mm auto 0;font-weight: bold;font-size: 18px;">
                调货通知单
              </p>
              <div class="info">
                <p>运输方式：</p>
                <p>调货序号：${this.sequence}</p>
              </div>
              <div class="printHeader">
                <div class="info">
                  <p>调入：${this.printInputNo}.${this.printInput}</p>
                  <p>（调出：${this.printOutput}）</p>
                  <p>调货日期：${this.printdate}</p>
                </div>
                <div class="info">
                  <p>请将下表的货品于：${this.printTime}前寄往下面地址</p>
                </div>
                <div class="info">
                  <p>请寄往此地址：${this.printAddress}</p>
                </div>
                <div class="info">
                  <p>联系人（收件人）：${this.printInput}</p>
                  <p>电话：${this.printPhone}</p>
                  <p>手机：${this.printCellPhone}</p>
                </div>
                <div class="info">
                  <p>并将货运单传回公司，谢谢合作！祝生意兴隆！</p>
                </div>
                <div class="info">
                  <p>打印日期：${this.printToday}</p>
                </div>
              </div>
            `;

            printHead.style.pageBreakBefore = "always";
            printBody.appendChild(printHead);
            this.openPrint(index + 2);
            return;
          }
        }

        if (index + 1 == length) {
          // 最后一行
          // console.log('最后一行s')
          printBody.appendChild(itemBox);

          let lastNum;
          if (!this.hasImage) {
            lastNum = length - parseInt(length / 6) * 6;
          } else {
            lastNum = length - parseInt(length / 24) * 24;
          }
          let printFoot = document.createElement("div");
          printFoot.classList.add("printFoot");
          printFoot.innerHTML = `
            <div class="info">
              <p>本页合计：${lastNum}</p>
            </div>
            <div class="info">
              <p>请务必配合调货，并附带明细，快递单号传回本公司。</p>
            </div>
            <div class="info">
              <p>若已销售请通知本公司业务，谢谢！</p>
              <p>制单员：${this.printOperator}</p>
            </div>
            <div class="info">
              <p>备注：${this.printRemark}</p>
            </div>
          `;
          printBody.appendChild(itemBox);
          printBody.appendChild(printFoot);
        }
      }

      let printHtml = document.getElementById("p").innerHTML;
      let wind = window.open(
        "",
        "newwindow",
        "height=500, width=1000, top=100, left=100, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no"
      );
      wind.document.body.innerHTML = printHtml;
      let style = document.createElement("style");
      style.type = "text/css";
      style.innerHTML = resources.printCSS;
      wind.document.head.appendChild(style);
      wind.print();
    },
    clearPrintArea() {
      document.getElementById("p").innerHTML = "";
    },

    remarkEnter(e, { sequence, result, i }) {
      // console.log(sequence)
      // console.log(result)
      let list = [];
      this.tableData2.forEach((e) => {
        // console.log(e)
        if (e.sequenceStatus == "已调") {
          this.$message.error("已调单不可修改");
          this.tableData1[i].remark = this.tableData1[i].iRemark;
          return;
        }
        e.remark = result;
        list.push(e);
      });
      update(JSON.stringify(list)).then((res) => {
        if (res.data.code == 200) {
          this.$message.success("修改成功");
        } else {
          this.$message.error("修改失败");
          this.tableData1[i].remark = this.tableData1[i].iRemark;
        }
      });
    },
    numberEnter(e, { sequence, result, i }) {
      // console.log(this.tableData2[i])
      let list = [];
      let newNumber = 0;
      this.tableData2.forEach((e) => {
        if (e.transferCargoSequence == sequence) {
          list.push(e);
          newNumber += Number(e.number);
        }
      });
      update(JSON.stringify(list)).then((res) => {
        if (res.data.code == 200) {
          this.$message.success("修改成功");
          for (const i of this.tableData1) {
            if (i.transferCargoSequence == sequence) {
              i.number = newNumber;
              break;
            }
          }
        } else {
          this.$message.error("修改失败");
          this.tableData2[i].number = this.tableData2[i].iNumber;
        }
      });
    },
    foldEnter(e, { sequence, result, i }) {
      let name = "";
      for (const i of this.customerList) {
        if (i.value == result) {
          name = i.label;
          break;
        }
      }
      let list = [];
      if (name) {
        this.tableData2.forEach((e) => {
          if (e.transferCargoSequence == sequence) {
            e.fold = result;
            e.foldName = name;
            list.push(e);
          }
        });
      } else {
        // console.log(this.tableData2[i])
        this.$message.error("无此客户编号");
        this.tableData2[i].fold = this.tableData2[i].iFold;
        return;
      }
      update(JSON.stringify(list)).then((res) => {
        if (res.data.code == 200) {
          this.$message.success("修改成功");
        } else {
          this.$message.error("修改失败");
          list.forEach((e) => {
            e.fold = e.iFold;
            e.foldName = e.iFoldName;
          });
        }
      });
    },
  },
  created() {
    if (localStorage.getItem("isStore") == "true") {
      this.Dis = true;
      getShop().then((res) => {
        console.log(res.data);
        this.outNo = res.data.data.no;
        this.outName = res.data.data.name;
      });
    } else {
      this.Dis = false;
    }
    // console.log(typeof(localStorage.getItem('isStore')))
    this.inpList = this.getInput();
    // 随机数赋值
    this.sessionId = Math.ceil(Math.random() * 1000000) + "";

    this.dateList = [this.getLastWeek(), this.getNowTime()];

    // 获取所有客户信息
    getClient({ limit: 99999 }).then((res) => {
      // console.log(res)
      if (res.data.code == 200) {
        let list = res.data.data || [];
        this.customerList = [];
        this.customerMap = {};
        list.forEach((e) => {
          if (e.stop != 1) {
            this.customerList.push({ value: e.no, label: e.name });
          }
          this.customerMap[e.no] = e.name;
        });
      }
    });

    getOperatorList().then((res) => {
      // console.log(res)
      if (res.data.code == 200 && res.data.data.length) {
        res.data.data.forEach((e) => {
          this.operatorList.push({ value: e, label: e });
        });
      }
    });
  },
  mounted() {
    this.$refs.upload.addEventListener("change", (e) => {
      //绑定监听表格导入事件
      this.readExcel(e);
    });
  },
};
</script>
